<template>
	<view class="ag_container safe-area-inset-bottom">
		<uni-nav-bar :fixed="true" backgroundColor="#00a660" color="#fff" height="90rpx" style="position:relative">
			<block slot="left">
				<i class="iconfont nav_backIcon" @click="back">&#xe8b8;</i>
				<span style="font-size: 30rpx;">待我确认签署</span>
			</block>
			<block slot="right">
				<button @click="invalidContract" class="navBtn" size="mini" v-if="isHideinvalidContractButton">撤回合同</button>
				<!-- 拒签合同 --> 
				<button @click="revoke" class="navBtn" size="mini" v-if="isShowRefuseButton" :disabled="isRefuse?true:false">{{refuseText}}</button>
				<rudon-rowMenuDotDotDot :clear="false" :localdata="options" @change="menuAction" v-if="isRefuse == true">
					<button class="navBtn" size="mini">更多操作</button>
				</rudon-rowMenuDotDotDot>
				<button @click="changeSign" class="navBtn" size="mini" v-if="!hasType && isType">立即转签</button>
				<button @click="nextForm" class="navBtn" size="mini" v-else-if="!isRefuse">确认签署</button>
			</block>
		</uni-nav-bar>
		<uni-notice-bar single text="点击合同签署控件，可自动加盖印章或签字章。" class="fixed-bar" />
		<uni-data-select v-model="value" :localdata="contractFilename" :clear="false" class="contract_select" @change="changeContract" />

		<!-- 参数填写 -->
		<view class="agree_jn" :class="{popupShow:popupShow}">
			<view v-if="idx == index" v-for="(file, index) in contractFile" :key="file.id">
				<!-- :class="scaleIndex===0?'bigPdf' : ''" -->
				<view class="drag" :style="{width:widthNum + 'px'}">
					<!-- 合同内容显示 -->
			        <pdf ref="pdfRef" :src="file.pdfSrc" v-for="i in file.pageCount" :page="i" style="margin:0 auto 9rpx;" @page-loaded="pageLoad"></pdf>
					<view v-show="isShowDrag" @click="stamp(item)" v-for="(item, index) in file.contractFileDragList"
						:class="['box', item.boxStamp]"
						:style="{transform:`translateX(${item.leftsMobile}px) translateY(${item.topMobile}px)`}">
						<i class="iconfont" :class="item.iconfont" v-if="item.type == 1"
							style="font-size: 30rpx; color: #999999"></i>
						<view style="font-size: 20rpx; padding-top: 10rpx" v-if="item.type == 1">{{ item.name }}</view>
						<view v-if="item.type == 3">
							<i class="iconfont" :class="item.iconfont" style="color: #000"></i>
							<span style="font-size: 20rpx; padding-left: 10rpx">{{ item.stampTime }}</span>
						</view>
						<view v-if="item.type == 2">
							<i class="iconfont" :class="item.iconfont" style="color: #999999"></i><span
								style="font-size: 20rpx; padding-left: 10rpx">{{ item.name }}</span>
						</view>
						<view v-if="item.type == 4" style="font-size:20rpx;padding-left: 10rpx;writing-mode:tb-rl;">
							{{ item.name }}
						</view>
						{{ item.model }}
						<img :src="item.src" :style="item.imgstyle" />
					</view>
				</view>
			</view>
		</view>
		
		<uni-fab ref="fab" :pattern="pattern" :content="content" :horizontal="horizontal" :vertical="vertical"
			style="opacity: 0.9;" :direction="direction" @trigger="changeSize" :icon="search" />
		<!-- 判断身份转交签署人 -->
		<transfer ref="transferDialog" @getSignPerson="getSignPerson" v-if="$store.getters.companyInfo.id != ruleForm.companyId && !hasType && isType"></transfer>	
		<!-- 参数设置 -->
		<uni-collapse style="position: fixed;bottom:0rpx;" @change="moving" :show="popupShow" v-else>
			<uni-collapse-item titleBorder="none" :border="false">
				<template v-slot:title>
					<view class="title_border">
						<span>有 {{haveSignNumber}} 处需要签署，已签署 {{haveSignNumberOk}} 处。</span>
						<span v-if="moveIndex==1">关闭</span>
						<span v-else>切换印章</span>
					</view>
				</template>
				<view class="content">
					<!-- 企业签章 -->
					<view v-if="isType">
						<!-- 企业印章 -->
						<view class="authentication_header">
							<span class="tit_span">企业印章</span>
						</view>
						<view class="wordImg">
							<view class="borderImg">
								<img :src="sealPic" class="sealCompanyPic" />
							</view>
							<view class="more_item" @click="opensealCompanyDialog">更多印章</view>
						</view>
						<!-- 企业授权人签字章 -->
						<template v-if="isShowCompanySign">
							<view class="authentication_header">
								<span class="tit_span">企业授权人签字章</span>
							</view>
							<view class="wordImg">
								<view class="borderImg">
									<img :src="signPic" class="sealPic" />
								</view>
								<view class="word_more">
									<view @click="toCreateSeal">添加签字章</view>
									<view><span @click="opensealSignDialog">更多签字章</span></view>
								</view>
							</view>
						</template>
					</view>
					<!-- 个人签字章 -->
					<view v-else>
						<view class="authentication_header">
							<span class="tit_span">个人签字章</span>
						</view>
						<view class="wordImg">
							<view class="borderImg">
								<img :src="signPic" class="sealPic" />
							</view>
							<view class="word_more">
								<view @click="toCreateSeal">添加签字章</view>
								<view><span @click="openSignDialog">更多签字章</span></view>
							</view>
						</view>
					</view>
					<!-- 合同已拒签 -->
					<uni-card title="合同已拒签" v-if="isRefuse">
						<p style="color: #333;">
							<span v-if="$store.getters.staffInfo.companyId == 0">{{$store.getters.name}}</span>
							<span v-else>{{$store.getters.companyName}}</span>
							于 {{ currentTime }} 拒签合同
						</p>
						<p style="font-size:26rpx;color: #777;">温馨提醒：您已拒签合同，若要继续签署，请点击【确认签署】按钮，完成签约。</p>
					</uni-card>
				</view>
			</uni-collapse-item>
		</uni-collapse>

		<!-- 更多印章 -->
		<uni-popup ref="companysealPopup" background-color="#fff" class="seal_dialog">
			<p class="popup-title">切换印章</p>
			<view class="popup-content">
				<view v-if="sealPicList.length !== 0">
					<view class="tableCompany_view" v-for="(flow, index) in sealPicList" :key="index">
						<view class="paddingImg">
							<img :src='"data:image/png;base64," + flow.image' @click="setSelect(flow)" />
						</view>
						<view class="company_name" v-if="flow.isDefault ==1">{{flow.name}}<i
								class="iconfont duihaoIcon">&#xe69e;</i></view>
						<view class="company_name" v-else>{{flow.name}}<i class="iconfont greyIcon">&#xe69e;</i></view>
						<span style="color: red;" v-if="flow.isDefault ==1">默认印章</span>
						<span class="themeColor" v-else @click="setSelect(flow)">设为默认
						</span>
					</view>
				</view>
				<!-- 暂无数据 -->
				<luanqingEmpty :show="true" text="没有更多数据啦" v-else />
			</view>
		</uni-popup>

		<!-- 更多签字章 -->
		<uni-popup ref="sealsignPopup" background-color="#fff" class="seal_dialog">
			<p class="popup-title">切换签字章</p>
			<view class="popup-content">
				<view v-if="signPicList.length !== 0">
					<view class="table_view" v-for="(flow, index) in signPicList" :key="index">
						<view class="paddingImg">
							<img :src='"data:image/png;base64,"+flow.image' @click="selectSign(flow)" />
						</view>
						<span v-if="flow.isSystem == 0" class="signType">手写签字章
							<i class="iconfont duihaoIcon" v-if="flow.isDefault ==1">&#xe69e;</i>
							<i class="iconfont greyIcon" v-else>&#xe69e;</i>
						</span>
						<span v-if="flow.isSystem == 1" class="signType">标准签字章
							<i class="iconfont duihaoIcon" v-if="flow.isDefault ==1">&#xe69e;</i>
							<i class="iconfont greyIcon" v-else>&#xe69e;</i>
						</span>
						<span style="color: red;" v-if="flow.isDefault ==1">默认印章</span>
						<span style="color: #00a660;" v-else @click="selectSign(flow)">设为默认</span>
					</view>
				</view>
				<!-- 暂无数据 -->
				<luanqingEmpty :show="true" text="没有更多数据啦" v-else />
			</view>
		</uni-popup>

        <!-- 撤回合同 -->
		<revoke-dialog ref="revoke" :id="invalidId" :invalidIsStarter="isStarter"></revoke-dialog>
		<!-- 拒签合同 -->
		<refuseSign-dialog ref="refuseSign" @ok="handleRefuse"></refuseSign-dialog>
		<!-- 确认签署 验证码弹出框 -->
		<confirmSignCode ref="codeDialog" @finishCode="finishSign(arguments)" />
		<!-- 确认签署 人脸弹出框 -->
		<signFaceDialog ref="signFaceDialog" />
		
		<!-- 确认转签信息弹出 -->
		<transfer-confirm ref="transferInfo" :data="ruleForm" :nowForm="transferTempData" :radio="this.transferTempData.radio" :personCer="personCer" @cancel="transferFlagCancel"
                @submit="immediately"></transfer-confirm>

	</view>
</template>
<script>
	import pdf from "vue-pdf";
	import config from '@/config';
	import transfer from './transfer';
	import {getToken} from "@/utils/auth";
	import {parseTime} from "@/utils/ruoyi";
	import signFaceDialog from "./signFaceDialog";
	import confirmSignCode from "./confirmSignCode";
	import transferConfirm from './transferConfirm';
	import {findByNameAndMobile} from "@/api/ec/console/org/staff";
	import {listSealPerson,updateSealPerson} from "@/api/sealPerson";
	import {selectListPermiss} from "@/api/ec/console/seal/staffSeal";
	import revokeDialog from '@/components/revokeDialog/revokeDialog';
	import refuseSignDialog from "@/components/refuseSignDialog/index";
	import luanqingEmpty from '@/components/luanqing-empty/luanqing-empty';
	import {listsealCompany,updateSealCompany} from "@/api/ec/work/contract/sealCompany";
	import {selectDragListByCompanyIdAndContractId} from "@/api/ec/work/contract/contractFile";
	import {checkEcSignFlowFeeOrder,decryptContractByMobile,getContract,getContractFlowByContractId} from "@/api/ec/work/contract/contract";
	import {signOneContract,transferFlow,updateContractSignMine,
		updateContractReject,getCacheRefuseContract,deleteLogicalFlow} from "@/api/ec/work/contract/contractSign";
	export default {
		components: {pdf,luanqingEmpty,confirmSignCode,transfer,signFaceDialog,refuseSignDialog,revokeDialog,transferConfirm},
		data() {
			return {
				form: {     //转交内容
				        name: '',
				        mobile: '',
				},
				personCer: '',
				radio: 1, //转交签署人
				isStarter:false, // 撤回类型 是否是发起方撤回
				refuseText: '拒签合同',
				popupShow: false, //出现弹窗页面是否滚动
				contractFlowForm: null,
				haveSignNumberOk: 0, //已签署个数
				widthNum: '',
				msgType: 'warning',
				scaleIndex: '', //0放大 1缩小 
				signPicList: [], //更多签字章
				sealPicList: [], //企业更多印章
				type: 'center',
				moveIndex: 0,
				options: [{
						value: 0,
						text: '确认签署'
					},
					{
						value: 1,
						text: '删除合同'
					},],
				search: 'search',
				content: [{
						text: '放大',
						active: false
					},
					{
						text: '缩小',
						active: false
					},
				],
				horizontal: 'right',
				vertical: 'bottom',
				direction: 'vertical',
				pattern: {
					color: '#3c3e49',
					backgroundColor: '#fff',
					selectedColor: '#00a660',
					buttonColor: '#00a660',
					iconColor: '#fff'
				},
				idx: 0,
				contractId: 0,
				numPages: 0,
				haveSignNumber: 0, //待签署个数
				host: config.baseUrl,
				value: 0,
				contractFile: '', // 合同附件
				sealPic: "", // 企业印章 主图
				signPic: "", // 个人签名 主图
				ruleForm: {},
				flowId: '', // 当前签署流程id
				contractFilename: [],
				isDefaultCompanyId: 0, //企业印章，签名默认选择
				isDefaultPersonId: 0, //个人印章，签名默认选择
				isRefuse: false, //默认没拒绝
				isShowDrag: false, // 默认进页面 不显示控件
				isType: '',
				hasType: '', //有无印章使用权限 false没有
				transferTempData: {}, // 转签签署人临时数据
				isShowRefuseButton: false, //是否隐藏拒签按钮 当前合同发起方 是没有拒签操作的
				isHideinvalidContractButton: false, //是否隐藏撤回按钮 当前合同接收方 是没有撤回操作的
				currentTime: parseTime(new Date(), '{y}-{m}-{d} {h}:{i}:{s}'), //当前时间
				invalidId:null,
				isShowCompanySign: false,// 授权人是否有签名要求
			};
		},
		onLoad(options) {
			if (this.$store.getters.staffInfo.companyId != 0) {
				this.isType = true
			} else {
				this.isType = false
			}
			// document.addEventListener('touchstart', this.touchSatrtFunc, false);
			this.$modal.loading();
			// this.$modal.msgSuccess(options.id);
			this.contractId = options.id;
			this.invalidId = JSON.parse(options.id)
			// 企业印章
			this.initSealCompany();
			// 个人印章
			this.initSealPersonList();
		},
		mounted() {
			this.initData();
		},
		renderTracked() {},
		watch: {
			contractFlowForm: {
				handler() {
					// 判断合同状态 若签署完成 直接跳转到合同详情
					if (this.contractFlowForm.status == 2 || this.contractFlowForm.status == 10) {
						uni.navigateTo({
							url: '/pages/sign/detail?id=' + this.contractFlowForm.contractId + '&flowId=' + this.contractFlowForm.id
						})
					}
				}
			},
		},
		methods: {
			/** 添加签字章 */
			toCreateSeal(){
				
			},
			/** 立即转交签署人 */
			immediately() {
			  const formArr = {id: this.flowId, sealerName: this.transferTempData.name, sealerMobile: this.transferTempData.mobile}
			  transferFlow(formArr).then(response => {
			    if (response.code == 200)
				  this.$modal.msgSuccess("转签成功");
				  uni.navigateTo({
				  	url: '/pages/sign/detail?id=' + this.ruleForm.id + '&flowId=' + this.flowId
				  })
			  })
			},    
			/** 取消转签 */
			transferFlagCancel() {
			  this.radio = 1
			  this.transferTempData.name = null
			  this.transferTempData.mobile = null
			},    
			/** 撤回合同 */
			invalidContract(){
				if (this.contractFlowForm.operId == this.$store.getters.staffInfo.id) {
				  this.isStarter = true;
				}     
				this.$refs.revoke.open()
			},
			/** 更多操作 */
			menuAction(e) {
				if (e == 0) {
					// 确认签署
					this.nextForm();
				} else if (e == 1) {
					// 删除拒签合同
					this.deleteRefuse();
				} 
			},
			// 删除拒签合同
			deleteRefuse() {
				this.$modal.confirm('仅删除己方合同，是否删除？').then(() => {
					return deleteLogicalFlow(this.flowId);
				}).then(() => {
					this.$modal.msgSuccess("删除成功");
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/index'
						})
					}, 500)
				}).catch(() => {});
			},
			handleRefuse() {
				this.refuseText = '已拒签'
			},
			/** 拒签合同 */
			revoke() {
				this.$refs.refuseSign.openDialog(this.flowId)
			},
			currentDataId() {
				if (this.$store.getters.staffInfo.companyId != 0) {
					return this.$store.getters.staffInfo.companyId;
				} else {
					return this.$store.getters.staffInfo.id;
				}
			},
			/** 放大缩小 */
			changeSize(e) {
				// 放大
				if (e.index == 0) {
					// this.scaleIndex = 0
					let dragWidth = document.getElementsByClassName("drag")[0].clientWidth
					this.widthNum = dragWidth + 50
				} else if (e.index == 1) {
					// 缩小
					let dragWidth = document.getElementsByClassName("drag")[0].clientWidth
					if (dragWidth > document.getElementsByClassName('agree_jn')[0].clientWidth) {
						this.widthNum = dragWidth - 50
					}
					// this.scaleIndex = 1
				}
			},
			/** 切换合同 */
			changeContract(e) {
				// 当前切换合同和上一个合同是同一个 防止重复点击
				if (this.idx == e) {
					return;
				}
				this.idx = e;
				this.$modal.loading();
			},
			/** 选择企业印章 */
			setSelect(data) {
				let dataOld = {};
				dataOld.id = this.isDefaultCompanyId;
				dataOld.isDefault = 0;
				updateSealCompany(dataOld).then(() => {})

				data.sealNumber = null;
				data.isDefault = 1;
				data.image = null;
				updateSealCompany(data).then(() => {}).then(() => {
					this.$modal.msgSuccess("设置默认成功");
					this.$refs.companysealPopup.close()
				}).then(() => {
					this.initSealCompany();
				})
			},
			/** 更多印章 */
			opensealCompanyDialog(type) {
				this.type = type
				this.$refs.companysealPopup.open(type)
			},
			/** 选择签名 */
			selectSign(data) {
				let dataOld = {};
				dataOld.id = this.isDefaultPersonId;
				dataOld.isDefault = 0;
				dataOld.image = null;
				updateSealPerson(dataOld).then(() => {})

				data.sealNumber = null;
				data.isDefault = 1;
				data.image = null;
				updateSealPerson(data).then(() => {}).then(() => {
					this.$modal.msgSuccess("设置默认成功");
					this.$refs.sealsignPopup.close()
				}).then(() => {
					this.initSealPersonList();
				})
			},
			/** 更多签字章 */
			opensealSignDialog() {
				this.$refs.sealsignPopup.open('center')
			},
			openSignDialog() {
				this.$refs.sealsignPopup.open('center')
			},
			/** 折叠框移动 */
			moving(e) {
				// moveIndex判断是否展开
				if (e.length != 0) {
					this.moveIndex = 1
					this.popupShow = true
				} else {
					this.moveIndex = 0
					this.popupShow = false
				}
			},
			// pdf已经加载的页码数
			pageLoad(e) {
				// 加载第一页就开始计算
				if (e == 1) {
					// 生成的单页 pdf 宽度 分辨率不同 宽度不同
					this.pdfWidth = this.$refs.pdfRef[0].$el.offsetWidth;
					// 生成的单页 pdf 宽度 分辨率不同 宽度不同
					this.pdfHeight = this.$refs.pdfRef[0].$el.offsetHeight
					// 动态获取印章 css宽度
					this.rightFixedWidth = (this.pdfWidth / 796) * 168;
					// 回显控件逻辑 此处 必须等待获取pdf实际显示的宽高后 处理 控件位置 接口中移动端盖章才有移动端 控件位置 如果是pc盖章leftsMobile 和 topsMobile 可能为空 此处重新计算
					this.contractFile.forEach((file) => {
						file.contractFileDragList.forEach((drag) => {
							drag.leftsMobile = (drag.lefts / 796) * this.pdfWidth;
							drag.topMobile = (drag.top / 1125) * this.pdfHeight;
						})
						// 经办人无权限  并且是企业 控件不显示
						if (this.hasType == false && this.isType == true) {
							file.contractFileDragList = [];
						}
						// 几处待签署 企业若有骑缝章 并且有签名  则重写为3个  若没有签名 则重写为2 个 个人则是一个
            let haveNumber = new Set();
            // 不统计3（时间印章） 因为时间自动盖
            file.contractFileDragList.filter(e => e.type != 3).forEach(e => {
              haveNumber.add(e.type)
            })
            this.haveSignNumber = haveNumber.size;
					})
					uni.hideLoading();
					// 默认加载第一个拖拽数据
					this.isShowDrag = true;
					// 盖章时间
					this.initStampDate();
				}
			},

			// 盖章时间
			initStampDate() {
				if (!!this.contractFile[this.idx]) {
					this.contractFile.forEach(file => {
						file.contractFileDragList.forEach((item) => {
							if (item.type == 3 && item.dataId == this.currentDataId()) {
								item.addBorderNone = "borderNone";
								item.name = "";
								item.iconfont = "";
								item.boxStamp = "timeSeal";
								let date = new Date();
								item.stampTime = date.getFullYear() + "年" + (date.getMonth() + 1) + "月" +
									date
									.getDate() + "日";
							}
						});
					})
				}
			},
			initData() {
				getContractFlowByContractId(this.contractId).then((response) => {
					// 从当前合同的流程中 找出当前账号需要签署的合同
					response.data.forEach(flow => {
						if (this.$store.getters.staffInfo.companyId != 0) {
							// 企业身份盖章人
							if (flow.sealerId == this.$store.getters.staffInfo.id && flow
								.systemCompanyId == this.$store.getters.staffInfo.companyId) {
								this.contractFlowForm = flow;
								// 经办人发起 盖章人盖章 显示拒签按钮 盖章人和经办人不是同一个人
								if (flow.isStarter == 0 || flow.sealerId !== flow.systemStaffId) {
									this.isShowRefuseButton = true;
								}
								this.flowId = flow.id;
							}
							// 合同经办人 并且是 发起方才可撤回
							if (flow.systemStaffId == this.$store.getters.staffInfo.id && flow
								.systemCompanyId == this.$store.getters.staffInfo.companyId && flow.isStarter == 1) {
								this.isHideinvalidContractButton = true;
							}
						} else {
							// 个人盖章
							if (flow.sealerId == this.$store.getters.staffInfo.id && flow
								.systemCompanyId == 0) {
								this.contractFlowForm = flow;
								if (flow.isStarter == 0 || flow.sealerId !== flow.systemStaffId) {
									this.isShowRefuseButton = true;
								}
								this.flowId = flow.id;
							}
							// 合同经办人 发起方才可撤回
							if (flow.systemStaffId == this.$store.getters.staffInfo.id && flow
								.systemCompanyId == 0 && flow.isStarter == 1) {
								this.isHideinvalidContractButton = true;
							}
						}
					})
					// 查询是否拒签过
					getCacheRefuseContract(this.contractFlowForm.id).then((response) => {
						let msg = response.msg;
						if (!!msg) {
							this.isRefuse = true;
							this.refuseText = '已拒签'
							this.currentTime = msg;
						}
					});
				});
				// 签署权限
				selectListPermiss().then((response) => {
					this.hasType = response.data
					// 没有签署权限显示转交签署内容
					if (this.hasType == false && this.isType == true) {
						//转交签署弹出框
						this.$refs.transferDialog.open()
					}
				});

				// 初始合同信息
				getContract(this.contractId).then((response) => {
					this.ruleForm = response.data;
					// 查看是否需要人脸验证
					if (this.ruleForm.isFace == 1) {
						this.$refs.signFaceDialog.show(this.ruleForm.contractNumber);
					}
				}).then(() => {
					// 初始 合同印章控件
					selectDragListByCompanyIdAndContractId(this.contractId).then((response) => {
						this.contractFile = response.data;
						this.contractFile.forEach((item, index) => {
							// 创建 选择文件下拉框数据 
							this.contractFilename.push({
								value: index,
								text: item.name,
								path: item.path
							});
							if (item.fileType == 0 ) {
							if(this.contractFlowForm.isCompanySignHtml == 1 || this.contractFlowForm.isCompanySignHtml == -1){
							    this.isShowCompanySign = true;
							  } else {
							    this.isShowCompanySign = false;
							  }
							}else if(item.fileType == 1){
							  if (this.contractFlowForm.isCompanySign == 1 || this.contractFlowForm.isCompanySign == -1) {
							    this.isShowCompanySign = true;
							  } else {
							    this.isShowCompanySign = false;
							  }
							}    

							// 默认选中第一个文件
							if (index == 0) {
								this.value = this.contractFilename[0].value;
								this.numPages = item.pageCount;
								// 解密并读取pdf文件
								item.pdfSrc = this.host +
									"/ec/contract/decryptContractByMobile?path=" + item.path +
									"&keyId=" + this.ruleForm.contractNumber + "&token=" +
									getToken();
							}
							// 必须延时处理 否则切换不会显示
							if (index > 0) {
								setTimeout(() => {
									item.pdfSrc = this.host +
										"/ec/contract/decryptContractByMobile?path=" + item
										.path + "&keyId=" + this.ruleForm.contractNumber +
										"&token=" + getToken();
								}, 300);
							}
						})


					});
				});
			},
			stamp(item) {
				item.addBorderNone = "borderNone";
				item.name = "";
				item.iconfont = "";
				if (item.type == 4) {
					item.boxStamp = "pageSeal";
					// 骑缝章
					const pageOneWidth = 168 / this.numPages;
					let imgIdnex = -1;
					this.contractFile[this.idx].contractFileDragList.forEach((drag) => {
						if (drag.type == 4) {
							if (item.src == null) {
								this.haveSignNumberOk++
							}
							imgIdnex++;
							drag.name = "";
							drag.iconfont = "";
							drag.src = this.sealPic;
							drag.imgstyle =
								"position:absolute;height:100%;right:-" +
								(this.numPages - (imgIdnex + 1)) * pageOneWidth +
								"rpx;clip:rect(0rpx," +
								(imgIdnex + 1) * pageOneWidth +
								"rpx,158rpx," +
								imgIdnex * pageOneWidth +
								"rpx);width:168rpx;object-fit: contain";
						}
					});
				}
				// 签名控件
				if (item.type == 2) {
					// 判断当前签名类型 是否包含 设置的类型 如果不存在设置 就进行删除
					if (!!this.contractFlowForm.sealInfo && this.contractFlowForm.sealInfo.indexOf(this.personSignType) == -1) {
					  this.$modal.msgError("请更换签名类型！");
					  return false;
					}
					// 企业签名控件个数显示
					if (item.src == null) {
						this.haveSignNumberOk++
					}
					// 每次加盖最新签名
					// this.initSealPersonList();
					item.boxStamp = "nameSeal";
					item.src = this.signPic;
					item.imgstyle = "width: 60%;height: 60%;object-fit: scale-down;margin-bottom:36rpx";
					item.sealPersonId = this.sealPersonId;
				}
				if (item.type == 1) {
					if (item.src == null) {
						this.haveSignNumberOk++
					}
					item.src = this.sealPic;
					item.imgstyle = "width: 99%;height: 99%;object-fit: contain";
					// 印章id
					item.sealCompanyId = this.sealCompanyId;
				}
			},
			// 加载个人签名列表 
			initSealPersonList() {
				listSealPerson().then((response) => {
					this.signPicList = response.data
					response.data.forEach((data) => {
						if (data.isDefault == 1) {
							this.signPic = "data:image/png;base64," + data.image;
							// 0系统生成 1手写签字章 
							this.personSignType = data.isSystem;
							this.sealPersonId = data.id;
							this.isDefaultPersonId = data.id;
						}
					});
				});
			},
			// 加载企业印章 
			initSealCompany() {
				listsealCompany().then((response) => {
					this.sealPicList = response.data;
					response.data.forEach((data) => {
						if (data.isDefault == 1) {
							this.sealPic = "data:image/png;base64," + data.image;
							this.sealCompanyId = data.id;
							this.isDefaultCompanyId = data.id;
						}
					});
				});
			},
			touchSatrtFunc(evt) {
				var touch = evt.touches[0]; //获取第一个触点
				var x = Number(touch.pageX); //页面触点X坐标
				var y = Number(touch.pageY); //页面触点Y坐标
				//记录触点初始位置
				console.log(x)
				console.log(y)
			},
			// 加载pdf 分页
			// getNumPages(url) {
			//   let loadingTask = pdf.createLoadingTask(url);
			//   loadingTask.promise
			//       .then((pdf) => {
			//         this.numPages = pdf.numPages;
			// 	if(this.numPages == 1){
			// 	    this.haveSignNumber = 3//企业印章，骑缝章
			// 	    }else{
			// 	    this.haveSignNumber = 4//企业印章，骑缝章
			// 	}
			//       });
			// },
			/** 保留草稿 */
			save() {
				uni.switchTab({
					url: '/pages/index'
				})
			},
			/** 返回 */
			back() {
                this.$tab.reLaunch('/pages/index')
				// uni.navigateBack({
				// 	delta: 1
				// });
			},
			// 完成签署
			finishSign(emit) {
				this.$modal.loading("签署中，请稍候...");
				// 修改当前签署流程
				// 保存盖章
				this.contractFile.forEach((file) => {
					file.contentSeal = JSON.stringify(file.contractFileDragList.filter(drag => drag
						.dataId == this.currentDataId()));
				});
				let flow = this.contractFlowForm;
				// 判断当前签署流程状态 若签署完成 直接跳转到合同页面
				flow.signStatus = 1;
				// 盖章状态
				flow.sealStatus = 1;
				// 拒签状态 设置为默认值 不拒签
				flow.isReject = 0;
				// 签署状态 签署流程状态，0默认，1待签署，2已签署，13拒签 10全部流程通过
				flow.status = 2;
				flow.sealTime = parseTime(new Date(), '{y}-{m}-{d} {h}:{i}:{s}');
				// 盖章人id
				flow.sealerId = this.$store.getters.staffInfo.id;
				// 盖章人姓名
				flow.sealerName = this.$store.getters.staffInfo.name;
				// 签名类型
				flow.personSignType = this.personSignType;
				// 盖章人手机号
				this.ruleForm.contractSignFlowList.push(flow);
				// 修改签署全部信息
				this.ruleForm.status = this.$enums.contractStatus.STAMP_OK;
				// 合同开始签署
				this.ruleForm.signStatus = 1;
				let data = {};
				// 盖章文件
				data.contractFiles = this.contractFile;
				data.contractDTO = this.ruleForm;
				data.contractDTO.params.smsCode = emit[0] //验证码
				data.contractDTO.params.signType = emit[1]; //签署校验类型
				this.$modal.loading("签署中，请稍候...");
				signOneContract(data).then((response) => {
					if (response.data == 1) {
						this.$modal.closeLoading()
						this.$modal.msgSuccess("签署成功");
						uni.navigateTo({
							url: '/pages/sign/detail?id=' + this.ruleForm.id + '&flowId=' + this.flowId
						})
					} else {
						this.$modal.closeLoading()
						this.$modal.msgError("签署异常,请联系管理员");
					}
				}).catch((error) => {
					this.$modal.closeLoading();
				});
			},
			// 获取回调选中的转签人
			getSignPerson(item) {
				this.transferTempData = item;
				if (this.transferTempData.radio == 2) {
				   let data = {name: this.transferTempData.name, mobile: this.transferTempData.mobile}
				     findByNameAndMobile(data).then(res => {
				       if (res.data) {
				         this.personCer = 1 //已认证
				       } else {
				         this.personCer = 0 //未认证
				       }
				    })
				}
				this.$refs.transferInfo.openDialog()
			},
			// 转签2次确认
			changeSign() {
				if(this.transferTempData.name == null){
					this.$modal.msgError("系统检测到您没有签署权限，请转交有权限的签署人！");
					if (this.hasType == false && this.isType == true) {
						//转交签署弹出框
						this.$refs.transferDialog.open()
					}
				}
					
				// this.transferTempData.id = this.flowId
				// transferFlow(this.transferTempData).then(response => {
				// 	if (response.code == 200) {
				// 		this.$modal.msgSuccess("转签成功");
				// 		uni.navigateTo({
				// 			url: '/pages/sign/detail?id=' + this.ruleForm.id + '&flowId=' + this.flowId
				// 		})
				// 	}
				// })
			},
			/** 下一步 */
			nextForm() {
				// 检查流量包
				let cpType;
				let companyIdOrStaffId;
				if (this.ruleForm.companyId == 0) {
					//个人合同
					cpType = 1;
					companyIdOrStaffId = this.ruleForm.staffId;
				} else {
					//企业合同
					cpType = 0;
					companyIdOrStaffId = this.ruleForm.companyId;
				}
				checkEcSignFlowFeeOrder(cpType, companyIdOrStaffId, this.contractFlowForm.transferFlag).then(response => {
					this.contractFile.contractId = this.ruleForm.id;

					// 判断有几个文件 单个文件和多个文件的提示不同
					if (this.contractFile.length == 1) {
						for (let i = 0; i < this.contractFile.length; i++) {
							let file = this.contractFile[i];
							for (let j = 0; j < file.contractFileDragList.length; j++) {
								let fileDrag = file.contractFileDragList[j];
								// 此处只用检查当前需要盖章的 控件数据
								if (fileDrag.dataId !== this.currentDataId()) {
									continue;
								}
								if (fileDrag.type == 1 && fileDrag.src == null) {
									this.$modal.msgError("当前文档，未完成签署，请继续签署！");
									return false;
								}
								if (fileDrag.type == 2 && fileDrag.src == null) {
									this.$modal.msgError("当前文档，未完成签署，请继续签署！");
									return false;
								}
								if (fileDrag.type == 4 && fileDrag.src == null) {
									this.$modal.msgError("当前文档，未完成签署，请继续签署！");
									return false;
								}
							}
						}
					} else {
						for (let i = 0; i < this.contractFile.length; i++) {
							let file = this.contractFile[i];
							for (let j = 0; j < file.contractFileDragList.length; j++) {
								let fileDrag = file.contractFileDragList[j];
								// 此处只用检查当前需要盖章的 控件数据
								if (fileDrag.dataId !== this.currentDataId()) {
									continue;
								}
								if (fileDrag.type == 1 && fileDrag.src == null) {
									this.$modal.msgError("第" + (i + 1) + "份文件《" + file.name + "》未完成签署，请继续签署！");
									return false;
								}
								if (fileDrag.type == 2 && fileDrag.src == null) {
									this.$modal.msgError("第" + (i + 1) + "份文件《" + file.name + "》未完成签署，请继续签署！");
									return false;
								}
								if (fileDrag.type == 4 && fileDrag.src == null) {
									this.$modal.msgError("第" + (i + 1) + "份文件《" + file.name + "》未完成签署，请继续签署！");
									return false;
								}
							}
						}
					}
					// 校验签署验证码
					this.$refs.codeDialog.openDialog()
				})
			},
		},
	};
</script>

<style lang="scss" scoped>
	::v-deep .uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title {
		color: red;
	}

	::v-deep .uni-navbar__header-btns-left {
		width: 220rpx !important;
	}

	::v-deep .uni-navbar__header-btns-right {
		width: 420rpx !important;
	}

	.popupShow {
		overflow: hidden;
		position: fixed;
	}

	.popup-content {
		padding: 50rpx 30rpx 30rpx 20rpx;
	}

	.popup-title {
		position: fixed;
		top: 15;
		background: #fff;
		padding-left: 30rpx;
		height: 60rpx;
		line-height: 60rpx;
		width: 86%;
		border-top-left-radius: 22rpx;
		border-top-right-radius: 22rpx;
	}

	.signType {
		text-align: left;
		width: 30%;
	}

	.paddingImg {
		width: 120rpx;
		height: 120rpx;
		display: flex;
		align-items: center;

		img {
			width: 120rpx;
			height: auto;
		}
	}

	.navBtn {
		background: $uni-color-primary !important;
		color: #fff !important;
		border: solid 1rpx #fff;
		height: 55rpx;
		line-height: 55rpx;
		margin-left: 20rpx;
	}

	::v-deep .uni-navbar__header-btns-left {
		width: 220rpx !important;
	}

	::v-deep .uni-navbar__header-btns-right {
		width: 420rpx !important;
	}

	// 切换合同选择框
	.contract_select {
		position: fixed;
		top: 160rpx;
		padding: 0 20rpx;
		background-color: #fff;
		height: 80rpx;
		z-index: 1;
		border: none;
		box-shadow: 0 12rpx 4rpx #ebebeb;
	}

	.contract_select ::v-deep .uni-select {
		border: none !important;
	}

	.contract_select ::v-deep .uni-select__input-text {
		font-weight: bold;
	}

	.contract_select ::v-deep .uni-icons {
		color: #000 !important;
		font-weight: bold;
	}

	.fixed-bar {
		position: fixed;
		padding: 0 20rpx;
		background-color: #fff;
		height: 80rpx;
		z-index: 1;
	}

	::v-deep .uni-noticebar__content-text--single {
		text-align: center;
		font-size: 26rpx;
	}

	// ::v-deep .uni-select__selector {
	// 	right: 240rpx;
	// }

	page {
		background-color: $uni-bg-color;
	}

	.greyIcon {
		color: #999;
		font-size: 26rpx;
		margin-left: 5rpx;
	}

	.duihaoIcon {
		color: $uni-color-primary;
		font-size: 26rpx;
		margin-left: 5rpx;
	}

	.company_name {
		overflow: hidden;
		white-space: normal;
		text-overflow: ellipsis;
		-webkit-line-clamp: 2; //显示行数
		display: -webkit-box;
		/*作为弹性伸缩盒子模型显示*/
		-webkit-box-orient: vertical;
		/*伸缩盒子的排列方式：从上到下垂直*/
		width: 55%;
	}

	.table_view {
		height: 120rpx;
		line-height: 120rpx;
		border-bottom: 1rpx solid #d7d9df;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.tableCompany_view {
		height: 160rpx;
		border-bottom: 1rpx solid #d7d9df;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.text_item {
		color: #666666;
		line-height: 45rpx;
	}

	::v-deep .uni-icons {
		color: #fff !important;
	}

	.refuse_dialog ::v-deep .uni-popup__wrapper {
		width: 90%;
	}

	.seal_dialog ::v-deep .uni-popup__wrapper {
		width: 90%;
		overflow-y: scroll;
		height: 40%;
	}

	::v-deep .uni-fab__circle--rightBottom {
		bottom: 200rpx;
		right: 50rpx;
		z-index: 0;
	}

	::v-deep .uni-fab--rightBottom {
		bottom: 200rpx;
		right: 50rpx;
		z-index: 0;
	}


	.nameSeal {
		height: 3% !important;
	}

	.timeSeal {
		height: 1% !important;
	}

	.title_border {
		height: 70rpx;
		line-height: 70rpx;
		color: #fff;
		padding-left: 30rpx;
		background: $uni-color-primary;
		width: 100%;
		display: flex;
		justify-content: space-between;

		.duihao {
			margin-left: 10rpx;
			font-size: 28rpx;
		}

		.gantan {
			margin-left: 10rpx;
			font-size: 28rpx;
			color: orange;
		}
	}

	.sealCompanyPic {
		width: 60%;
		height: auto;
	}

	.sealPic {
		width: 350rpx;
		height: auto;
	}

	.borderImg {
		border: 1rpx solid $uni-color-primary;
		border-radius: 5rpx;
		width: 350rpx;
		height: 240rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.word_more {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: 240rpx;

		view {
			width: 216rpx;
			font-size: 28rpx;
			text-align: center;
			color: $uni-color-primary;
			line-height: 100rpx;
			background-color: #ececec;
			border-radius: 10rpx;
		}
	}

	.wordImg {
		display: flex;
		align-items: center;
		margin: 30rpx 32rpx;
		justify-content: space-between;
		height: 240rpx;

		.more_item {
			margin-left: 60rpx;
			width: 216rpx;
			height: 240rpx;
			text-align: center;
			color: $uni-color-primary;
			line-height: 240rpx;
			background-color: #ececec;
			border-radius: 10rpx;
		}
	}

	.authentication_header {
		padding: 20rpx;
		background-color: #ececec;
		font-size: 22rpx;

		.tit_span {
			color: #666666;
			font-size: 28rpx;
		}
	}

	.nameSeal {
		height: 48rpx !important;
	}

	.timeSeal {
		height: 40rpx !important;
	}

	.pageSeal {
    width: 10.5% !important;
	}

	// pdf显示
	.drag {
		margin: 0 auto;
		position: relative;
		width: 100%;

		.box {
			border: 1rpx dashed #125ef7;
			position: absolute;
			width: 18%;
			height: 7%;
			user-select: none;
			cursor: pointer;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			border-radius: 10rpx;
			width: 158rpx;
			height: 158rpx;
			background: #f1f1f1;
			opacity: 0.9;
			left: 0;
			top: 0;

			&:hover {
				border: 1rpx solid #276ef9;
				box-shadow: 0 0 12rpx #276ef9;
				opacity: 0.9;
				background: #fff;
			}
		}
	}

	// 转交签署人
	.notice {
		text-align: center;
		background-color: #f7efdf;
		color: #ff4512;
		padding: 16rpx 0;
		font-size: 24rpx;
	}

	.hand {
		width: 100%;
		background: $uni-color-primary;
		color: #fff;
		height: 90rpx;
		line-height: 90rpx;
		font-size: 28rpx;
		border-radius: 0rpx;
	}

	.uni-collapse {
		background: $uni-color-primary;
		margin-top: 16rpx;
	}

	.content {
		padding: 30rpx 28rpx 10rpx;
		height: 850rpx;
		overflow-y: scroll;
	}

	.ag_container {
		position: relative;
	}

	page {
		background: $uni-bg-color;
	}

	.agree_jn {
		background-color: #fff;
		margin: 230rpx 0 0;
		width: 100%;
		overflow-y: scroll;
	}
</style>